    <style type="text/css">
        body,button,input,select,textarea {
    font: 12px/1.5 "Microsoft Yahei",tahoma,arial,"Hiragino Sans GB";
    -webkit-font-smoothing: antialiased;
}

.ng-iconfont,em,i {
    font-style: normal;
}

.ng-toolbar,.ng-toolbar .ng-bar-node,a.ng-close {
    line-height: 35px;
    height: 35px;
}

body {
   background: #f4f4f4
}

h1,h2,h3,h4,h5,h6 {
    font-size: 100%;
}

fieldset,img {
    border: 0;
}

li,ol,ul {
    list-style: none;
}

.new-threeFloor .content-four {
    padding-top: 8px;
    overflow: hidden;
    background: #f4f4f4
}

.new-threeFloor .content-four ul {
    height: 364px;
}

.new-threeFloor .content-four li {
    position: relative;
    float: left;
    width: 228px;
    height: 171px;
    border-width: 0 10px 10px 0;
    border-color: #f2f2f2;
    border-style: solid;
    background: #FFF;
}

.new-threeFloor .content-four li a.click-area {
    float: left;
    width: 100%;
    height: 100%;
}

.new-threeFloor .content-four li img {
    position: absolute;
    width: 110px;
    height: 110px;
    top: 0;
    left: 65px;
}

.new-threeFloor .content-four li p.name {
    width: 170px;
    height: 20px;
    line-height: 20px;
    margin: 123px auto 0;
    text-align: center;
    font-size: 14px;
    color: #222;
    overflow: hidden;
}

.new-threeFloor .content-four li p.like {
    width: 170px;
    height: 14px;
    margin: 6px auto 0;
    color: #1498e3;
    line-height: 14px;
    text-align: center;
    overflow: hidden;
}

.new-threeFloor .content-four li p.like i {
    position: relative;
    padding-left: 16px;
}

.new-threeFloor .content-four li p.like i em {
    position: absolute;
    top: 2px;
    left: 0;
    width: 12px;
    height: 12px;
    background: url("//res.suning.cn/project/cmsWeb/suning/homepage/v6/css/images/index.png?v=2019120901") -731px -116px;
}

.new-threeFloor .content-four li p.desc {
    width: 170px;
    height: 14px;
    margin: 6px auto 0;
    color: #dd5352;
    line-height: 14px;
    text-align: center;
    overflow: hidden;
}

.new-threeFloor .content-four li.item3 img,.new-threeFloor .content-four li.item4 img {
    top: 5px;
}

.new-threeFloor .tm-area .title .right-more span {
    display: none;
}

.new-threeFloor .tm-area span.border {
    background: #dd5352;
}

.new-threeFloor .tm-area .img-infor {
    position: absolute;
    width: 200px;
    height: 110px;
    top: 0;
    left: 65px;
    overflow: hidden;
}

.new-threeFloor .tm-area .img-infor .infor-wrapper {
    position: relative;
    top: 0;
    height: 220px;
    width: 200px;
    transition: top 1s ease;
}

.new-threeFloor .tm-area .img-infor .infor-wrapper img {
    display: block;
    left: 0;
    top: 0;
}

.new-threeFloor .tm-area .img-infor .hide-wrapper {
    position: absolute;
    top: 110px;
    left: 0;
    width: 110px;
    height: 110px;
    text-align: center;
}

.new-threeFloor .tm-area .img-infor .hide-wrapper .logo {
    display: block;
    width: 72px;
    height: 35px;
    top: 22px;
    left: 19px;
    background: 0;
}

.new-threeFloor .tm-area .img-infor .hide-wrapper span {
    position: absolute;
    top: 79px;
    left: 25px;
    width: 60px;
    height: 18px;
    color: #FFF;
    background: #f67f7e;
    border-radius: 9px;
    line-height: 18px;
    background-image: linear-gradient(90deg,#f67f7e 0,#dd5352 100%);
}

.new-threeFloor .tm-area li.item3 .img-infor,.new-threeFloor .tm-area li.item4 .img-infor {
    top: 5px;
}

.new-threeFloor .tm-area li:hover .infor-wrapper {
    top: -110px;
}

.new-threeFloor .phb-area .title {
    color: #db5757;
    background: #fdf6f6;
}

.new-threeFloor .phb-area span.border {
    background: #db5757;
}

    </style>
    <div style="width: 1190px;margin: 0 auto;">
          <div class="new-threeFloor clearfix">
        <div class="little-area tm-area little-area2">
            <div style="width: 1190px;height: 20px;padding-bottom: 10px;position: relative;">
                <div style="display: inline-block;background-color: #333;width: 5px;height: 13px;"></div>
                <span style="font-size: 19px;color: #000;height: 28px;">&nbsp;&nbsp;为你精选</span>
                <a href="" style="position: absolute;right:14px;background-size: 18px 18px;width: 36px;padding-right: 14px;background-repeat: no-repeat;background-position: right center;background-image: url(//img.alicdn.com/tfs/TB1B7RoaMMPMeJjy1XcXXXpppXa-36-36.png);z-index: 99">更多</a>
            </div>
            <div class="content content-four">
                <ul>
                   {for start="0" end="10"}
                     <li class="item1">
                        <a class="click-area">
                            <p class="name">雅马哈</p>
                            <p class="desc">今日特价6.7折起</p>
                        </a>
                        <a class="img-infor" sap-expo="true">
                            <div class="infor-wrapper">
                                <img class="lazy-loading" src="//image.suning.cn/uimg/b2c/qrqm/0010148770000000011541645274_200x200.jpg?ver=2000&from=mobile">
                                <div class="hide-wrapper">
                                    <img class="logo lazy-loading" src="//image.suning.cn/uimg/nmps/MPPCLOGO/1004254247384_3.jpg?from=mobile"><span class="enter-btn">立即进入</span>
                                </div>
                            </div>
                        </a>
                    </li>
                    {/for}
                   
                </ul>
            </div>
        </div>
    </div>
    </div>
